import React, { Component } from 'react'

export default class FuckEvent extends Component {
    state = {
        showBox: false
    }
    componentDidMount() {
        window.addEventListener('click', this.handleClickBody, false)
    }
    componentWillUnmount() {
        window.removeEventListener('click', this.handleClickBody, false)
    }
    handleClickBody = (e) => {
        this.setState({
            showBox: false
        })
    }
    handleClickButton = (e) => {
        e.stopPropagation();
        this.setState({
            showBox: true
        })
    }

    render() {
        return (
            <div>
                <button onClick={this.handleClickButton}>点击我显示弹窗</button>

                {this.state.showBox && (
                    <div onClick={e => e.stopPropagation()}>我是弹窗</div>
                )}
            </div>
        )
    }
}